/**
* @description: 标准化作业-推演分配
* @author: wqn
* @describe:
**/
<template>
	<view class="deduction">
		<nav-bar title="推演分配" @goBack="goBack"></nav-bar>
		<view class="main">
			<van-form ref="userForm">
				<view class="top-list">
					<van-field disabled label="推演成员" required input-align="right" />
					<van-field v-model="deductionData.className" is-link label="班组成员" input-align="right" readonly
						placeholder="请选择" @click="userChange('班组成员')"
						:rules="(deductionData.className !=='' || deductionData.outsidePerson !=='') ?[]:[{ required: true,trigger:'onChange', message: '' }] " />
					<van-field v-model="deductionData.outsidePerson" is-link label="外部厂商成员" input-align="right" readonly
						:rules="(deductionData.className !=='' || deductionData.outsidePerson !=='') ?[]:[{ required: true,trigger:'onChange', message: '' }] "
						placeholder="请选择" @click="userChange('外部厂商成员')" />
				</view>
				<view class="bottom-list">
					<van-field v-model="deductionData.deductionTime" is-link placeholder="请选择" label="推演时间" required
						readonly input-align="right" @click="showDate = true"
						:rules="[{ required: true,trigger:'onChange', message: '' }]" />
					<van-field v-model="deductionData.deductionAddress" label="推演地点" required input-align="right"
						placeholder="请输入" :rules="[{ required: true,trigger:'onChange', message: '' }]" />
				</view>
			</van-form>
		</view>
		<view class="verify">
			<van-button type="info" round @click="affirmClick">确认</van-button>
		</view>
		<!--    时间选择器-->
		<van-popup v-model="showDate" round position="bottom">
			<van-datetime-picker v-model="currentDate" type="datetime" title="选择时间"
				@confirm="selectTime(currentDate)"  :min-date="minDate"/>
		</van-popup>
		<!-- <van-calendar v-model="showDate" type="currentDate" color="#417ADC" @confirm="selectTime" /> -->
		<!--选择人员-->
		<van-popup v-model="showSelectUser" position="right">
			<selectUser :equIds="equIds" :selected.sync="staffList" @cancel="showSelectUser = false"
				:roleId="executiveRoleId" @comfirm="userComfirm" />
		</van-popup>
		<!--选择外商人员-->
		<van-popup v-model="showSelectExternalUser" position="right">
			<selectExternalUser :equIds="ExternalUserIds" :selected.sync="ExternalUserList"
				@cancel="showSelectExternalUser = false" :roleId="ExternalUserRoleId" @comfirm="userExternalComfirm" />
		</van-popup>
	</view>
</template>

<script>
	import NavBar from "../../standardizedOperation/common/navBar.vue";
	import selectUser from "../../standardizedOperation/common/selectUser.vue"
	import selectExternalUser from "../../standardizedOperation/common/selectExternalUser.vue"
	import {
		Dialog,
		Toast
	} from "vant";
	import {
		mapGetters
	} from 'vuex'
	import moment from "moment/moment";
	export default {
		name: "deductionAllocation",
		components: {
			NavBar,
			selectUser,
			selectExternalUser,
		},
		data() {
			return {
				showClassPerson: false,
				showOutsidePerson: false,
				showDate: false,
				deductionData: {
					workPlanId: "", //计划id
					consultationDeductionId: "", //子流程日志节点ID
					consultationAssignedId: "", //分配人id
					consultationAssignedName: "", //分配人
					deductionTime: '', //时间
					deductionAddress: '', //地点
					discussers4: "", //班组成员id
					discussers5: "", //外商人员id
					className: "", //班组人员
					outsidePerson: "" //外商人员
				},
				initDataParam: {},
				staffList: {}, //选择人员数据
				showSelectUser: false, //人员选择
				executiveRoleId: "",
				equIds: [], //人员id
				ExternalUserList: {}, //选择外商人员数据
				showSelectExternalUser: false, //外商人员选择
				ExternalUserRoleId: "",
				ExternalUserIds: [], //外商人员id
				currentDate: new Date(),
				minDate:new Date(),
			}
		},
		computed: {
			...mapGetters(['userData']),
		},
		/**
		 * @param {Object} option
		 * flowState=2已完成
		 */
		onLoad(option) {
			this.initDataParam = JSON.parse(decodeURIComponent(option.message))
			this.deductionData.workPlanId = this.initDataParam.id
			this.deductionData.consultationDeductionId = this.initDataParam.objId
			this.deductionData.consultationAssignedId = this.userData.userId
			this.deductionData.consultationAssignedName = this.userData.userName
		},
		methods: {
			goBack() {
				uni.navigateBack()
			},
			/**
			 * 班组成员
			 */
			userComfirm() {
				this.showSelectUser = false
				this.deductionData.className = this.staffList.text
				this.deductionData.discussers4 = this.staffList.ids.join()
			},
			/**
			 * 外部厂商成员选择
			 */
			userExternalComfirm() {
				this.showSelectExternalUser = false
				this.deductionData.outsidePerson = this.ExternalUserList.text
				this.deductionData.discussers5 = this.ExternalUserList.ids.join()
			},
			userChange(tag) {
				if (tag === "外部厂商成员") {
					this.showSelectExternalUser = true
				} else {
					this.showSelectUser = true
				}
			},
			/**
			 * 通知上一个页面刷新数据
			 */
			back() {
				let pages = getCurrentPages()
				let prevPage = pages[pages.length - 2] //上一个页面
				prevPage.isRefresh = true
				uni.navigateBack()
			},
			affirmClick() {
				this.$refs.userForm.validate().then(() => {
					Dialog.confirm({
							message: '提交后不可修改，是否确定提交？',
							confirmButtonColor: "#417adc",
						})
						.then(() => {
							this.$apiRequest.bzhzyApi.deductionAllocation(this.deductionData).then(res => {
								Toast(res.msg)
								this.back()
							})
						})
						.catch(() => {
							// on cancel
						});
				})

			},
			formatDate(date) {
				return `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
			},
			/**
			 * @param {Object} currentDate
			 */
			selectTime(currentDate) {
				let timeString = "";
				timeString = moment(currentDate).format('YYYY-MM-DD HH:mm')
				this.deductionData.deductionTime  = timeString
				this.showDate = false
				// const [start, end] = date;
				// this.showDate = false;
				// this.date = `${this.formatDate(start)} - ${this.formatDate(end)}`;
				// this.deductionData.deductionTime = this.date
			},
		}
	}
</script>

<style lang="scss" scoped>
	.deduction {
		width: 100vw;
		height: 100vh;
		background: #F2F6FA;

		.main {
			margin: px2vh(30);

			.top-list {
				margin-bottom: px2vh(30);
			}
		}

		.verify {
			.van-button--normal {
				width: calc(100% - #{px2vw(60)});
				height: px2vh(120);
				font-size: px2vh(46);
				background: #417ADC;
				border: 1px solid #417ADC;
				position: absolute;
				bottom: px2vh(60);
				left: px2vw(30);
			}
		}

	}
</style>
